import { defineStore } from 'pinia'
import { ref } from 'vue'

export const useAppStore = defineStore('app', () => {
  // 设备类型，'desktop' 或 'mobile'
  const device = ref('desktop')
  // 侧边栏折叠状态
  const sidebarCollapsed = ref(false)

  // 切换侧边栏
  function toggleSidebar() {
    sidebarCollapsed.value = !sidebarCollapsed.value
  }

  // 关闭侧边栏（用于移动端点击遮罩层）
  function closeSidebar() {
    sidebarCollapsed.value = true
  }
  
  // 设置设备类型
  function setDevice(deviceType) {
    device.value = deviceType
    // 移动设备默认收起侧边栏
    if (deviceType === 'mobile') {
        sidebarCollapsed.value = true
    }
  }

  return {
    device,
    sidebarCollapsed,
    toggleSidebar,
    closeSidebar,
    setDevice,
  }
})